<template>
    <div class="home">
        <div class="title">智慧水务</div>
        <div class="title_sub_l">
            <a href="http://192.168.10.54:30000" target="_bank" title="智慧水务云平台">智慧水务云平台</a>
        </div>
        <div class="title_sub_r">
            <a href="http://192.168.10.54:30001" target="_bank" title="营销收费系统">营销收费系统</a>
        </div>
    </div>
</template>

<script>
    export default {
        layout: "layoutNo",
        mounted() {}
    };
</script>
<style lang="scss" scoped>
    .home {
        background: #fff url("/images/bg-home.png") no-repeat center;
        background-size: cover;
        height: 100vh;
        min-width: 1200px;
        position: relative;

        .title {
            display: flex;
            align-items: center;
            /* 垂直居中 */
            justify-content: center;
            height: 100%;
            padding-right: 3%;
            padding-top: 60px;
            color: #fff;
            font-size: 3.5em;
            text-align: center;
        }

        .title_sub_l {
            position: absolute;
            top: 55%;
            right: 64%;
            background: url("/images/r_2.png") no-repeat center;
            background-size: cover;
            width: 395px;
            height: 100px;
            font-size: 2em;
            text-align: left;
            line-height: 130px;
            padding-left: 60px;
        }

        .title_sub_r {
            position: absolute;
            top: 45%;
            left: 60%;
            background: url(/images/l_2.png) no-repeat center;
            background-size: cover;
            width: 395px;
            height: 100px;
            font-size: 2em;
            text-align: center;
            line-height: 66px;
            padding-left: 60px;
        }

        a {
            color: #fff;
        }
    }
</style>